import Taro from '@tarojs/taro'
import { View } from '@tarojs/components'
import './index.less'
import OrderList from '../../components/OrderList/index';
import api from '../../service/api';
import { AtTabs, AtTabsPane } from 'taro-ui'

export default class DoctorSystem extends Taro.Component {

  config = {
    navigationBarTitleText: '医生平台',
    enablePullDownRefresh: true
  }

  constructor() {
    super(...arguments)
    this.state = {
        tabOne:[],
        tabTwo:[],
        tabThree:[],
        current: 0,
    }
  }

  componentDidMount(){
    this.getList()
  }

  onPullDownRefresh(){
    Taro.showNavigationBarLoading()
    this.getList()
  }

  getList = () =>{
    let params = {}
    params.userId = Taro.getStorageSync('loginInfo').userId
    params.role = Taro.getStorageSync('loginInfo').role
    api.get('/inquiry/find/OrderStatus', params).then(res=>{

      if(res.data.data){
        let tab1 = []
        let tab2 = []
        let tab3 = []

        for(let item in res.data.data){
          if(res.data.data[item].orderStatus == 1){
            tab1.push(res.data.data[item])
          }else if(res.data.data[item].orderStatus == 2){
            tab2.push(res.data.data[item])
          }else if(res.data.data[item].orderStatus == 3 || res.data.data[item].orderStatus == 4){
            tab3.push(res.data.data[item])
          }
        }

        this.setState({
          tabOne:tab1,
          tabTwo:tab2,
          tabThree:tab3
        })

        Taro.hideNavigationBarLoading();
        Taro.stopPullDownRefresh();
      }
    })
  }

  handleClick (value) {
    this.setState({
      current: value
    })
  }


  render() {
    const tabList = [{ title: '待接诊('+this.state.tabOne.length+')' }, { title: '进行中('+this.state.tabTwo.length+')' }, { title: '已结束('+this.state.tabThree.length+')' }]
    return (

      <AtTabs current={this.state.current} tabList={tabList} onClick={this.handleClick.bind(this)}>
      <AtTabsPane current={this.state.current} index={0} >
        <View className='doctor-system-item'>
          <OrderList data={this.state.tabOne}></OrderList>
        </View>
      </AtTabsPane>
      <AtTabsPane current={this.state.current} index={1}>
        <View className='doctor-system-item'>
          <OrderList data={this.state.tabTwo}></OrderList>
        </View>
      </AtTabsPane>
      <AtTabsPane current={this.state.current} index={2}>
        <View className='doctor-system-item'>
          <OrderList data={this.state.tabThree}></OrderList>
        </View>
      </AtTabsPane>
    </AtTabs>
    )
  }
}
